﻿<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>Table</title>
		<link rel="stylesheet" href="../webjars/plugins/layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="../webjars/css/global.css" media="all">
		<link rel="stylesheet" href="../webjars/plugins/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="../webjars/css/table.css" />
	</head>

	<body>
		<div class="admin-main">
			<blockquote class="layui-elem-quote">
				<a href="javascript:;" class="layui-btn layui-btn-small J_form_dialog" templdate-url="add.html" act-url="/admin/clientDetails/add">
					<i class="layui-icon">&#xe608;</i> 添加Profilexxx
				</a>
			</blockquote>
			<form class="layui-form layui-form-pane" action="">
				<div class="layui-form-item">
					<label class="layui-form-label">CLIENT ID:</label>
					<div class="layui-input-inline">
						<input type="text" value="" name="clientId" placeholder="根据姓名过滤" class="layui-input">
					</div>
					<label class="layui-form-label">手机号:</label>
					<div class="layui-input-inline">
						<input type="text" value="" name="mobile" placeholder="根据手机号过滤" class="layui-input">
					</div>
					<button id="J-search" class="layui-btn" lay-filter="J-search" lay-submit>查询</button>
				</div>
			</form>
			<fieldset class="layui-elem-field">
				<legend>Profile列表</legend>
				<div class="layui-field-box layui-form">
					<table id="tttt" class="layui-table" lay-filter="demo">
					  <thead>
					    <tr>
					      <th lay-data="{field:'clientId', width:180, sort: true, fixed: true}">ID</th>
					      <th lay-data="{field:'clientName', width:180}">Name</th>
					      <th lay-data="{fixed: 'right', width:260, align:'center', toolbar: '#barDemo'}"></th>
					      <!--
					      <th lay-data="{field:'sex', width:80, sort: true}">性别</th>
					      <th lay-data="{field:'city', width:80}">城市</th>
					      <th lay-data="{field:'sign', width:177}">签名</th>
					      <th lay-data="{field:'experience', width:80, sort: true}">积分</th>
					      <th lay-data="{field:'score', width:80, sort: true}">评分</th>
					      <th lay-data="{field:'classify', width:80}">职业</th>
					      <th lay-data="{field:'wealth', width:135, sort: true}">财富</th>
					      -->
					    </tr>
					  </thead>
					</table>
					 
					<script type="text/html" id="barDemo">
					  <a class="layui-btn layui-btn-primary layui-btn-mini" lay-event="detail">查看</a>
					  <a class="layui-btn layui-btn-mini" lay-event="edit">编辑</a>
					  <a class="layui-btn layui-btn-danger layui-btn-mini" lay-event="del">删除</a>
					</script>
				</div>
				<div class="layui-tab-item">
				</div>
			</fieldset>
			        
		</div>
		
		<script type="text/javascript" src="../webjars/plugins/layui/layui.js"></script>
        <script type="text/javascript" src="../webjars/js/common.js?v20170728?a=91"></script>
					      
        <script>
        
		
							
		layui.use(['jquery', 'table', 'form'], function(){
				var $ = layui.$;
				var table = layui.table;
			  	var form = layui.form;
			  	
			  	var tcols = [[
								{ field: 'clientId', title: 'clientId'},
				        		{ field: 'clientName', title: 'clientName'}
							]];
							
					//监听提交  
				  form.on('submit(J-search)', function(data){
					table.render({
				  		elem: '#tttt',
						url: '/admin/clientDetails/list',
						where: data.field,
						cols : tcols,
						page: true,
						limit: 10,
						method: 'post'
						});
				    return false;  
				  });  
  
		
				$("#J-search").click();
		});
		
		
		

		    
		</script>
		
		

	</body>

</html>